<template>
	<view class="page flex flex-col">
		<navbar :leftText="'详情'" :backStatus="true"></navbar>
		<view class="w690 flex-1 shouDetailMain">
			<view class="flex-between">
				<view>用户</view>
				<view class="detailValue">{{deviceObj.owner}}</view>
			</view>
			<view class="flex-between">
				<view>电话</view>
				<view class="detailValue">{{deviceObj.mobile}}</view>
			</view>
			<view class="flex-between">
				<view>团队长</view>
				<view class="detailValue">{{deviceObj.leaderName || '--'}}</view>
			</view>
			<view class="flex-between">
				<view>运营商</view>
				<view class="detailValue">{{deviceObj.isp || '--'}}</view>
			</view>
			<view class="flex-between">
				<view>安装日期</view>
				<view class="detailValue">{{deviceObj.buildTime}}</view>
			</view>
			<view class="flex-between">
				<view style="margin-top:10rpx">安装地址</view>
				<view class="detailValue" style="margin-top:10rpx">{{deviceObj.address || '--'}}</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app";
	import * as api from "@/utils/api.js"
	import {
		ref,
		reactive,
		onMounted,
		inject
	} from 'vue';
	let imageUrl = ref("");
	onMounted(() => {
		// 全局变量引入
		const globalData = inject('globalData');
		imageUrl.value = globalData.value.imgOssUrl;
	})

	// 设备code
	const deviceCode = ref("")


	onLoad((ops) => {
		deviceCode.value = ops.code;
	})

	onShow(() => {
		getDeviceDetail(deviceCode.value)
	})

	// 设备详情
	const deviceObj = ref();

	const getDeviceDetail = (code) => {
		let e = {
			url: '/app-api/index/profit-detail',
			data: {
				code: code
			}
		};
		api.default.get(e).then((res) => {
			deviceObj.value = res.data;
		})
	}
</script>

<style scoped>
	.shouDetailMain {
		color: #FFF;
		font-size: 28rpx;
	}

	.shouDetailMain>view {
		height: 100rpx;
		/* line-height: 100rpx; */
	}

	.shouDetailMain>view:not(:last-child) {
		border-bottom: 2rpx solid #1F1757;
	}

	.detailValue {
		color: #5A669E;
	}
</style>